<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>高德地图点击添加单一标记</title>
    <script src="https://webapi.amap.com/maps?v=1.4.15&key=YOUR_KEY"></script>
    <style>
        #container {
            width: 100%;
            height: 500px;
        }
    </style>
</head>
<body>
    <div id="container"></div>
    <p id="info"></p>
    <script>
        // 创建地图实例
        var map = new AMap.Map('container', {
            zoom: 15, // 缩放级别
            center: [116.397428, 39.90923] // 初始中心点坐标
        });

        var currentMarker = null; // 用于存储当前的标记

        // 监听地图点击事件
        map.on('click', function (e) {
            var lnglat = e.lnglat; // 获取点击点的经纬度
            var lng = lnglat.getLng(); // 经度
            var lat = lnglat.getLat(); // 纬度

            // 在页面上显示经纬度
            document.getElementById('info').innerText = '经度: ' + lng + ', 纬度: ' + lat;

            // 如果已经存在标记，先将其从地图上移除
            if (currentMarker) {
                currentMarker.setMap(null);
            }

            // 创建新标记
            currentMarker = new AMap.Marker({
                position: lnglat,
                map: map
            });

            // 可选：设置标记的自定义图标
            currentMarker.setIcon('https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png');

            // 可选：设置标记的弹出信息
            var infoWindow = new AMap.InfoWindow({
                content: '<div>经度: ' + lng + '<br>纬度: ' + lat + '</div>',
                offset: new AMap.Pixel(0, -30)
            });
            currentMarker.on('click', function() {
                infoWindow.open(map, currentMarker.getPosition());
            });
        });
    </script>
</body>
</html>
